'use strict';
import React, { PropTypes } from 'react';
import { connect } from 'react-redux';
import { Spin } from 'antd';
import { init } from '../../reducers/app/actions';
import Header from '../../components/Header/index'
import { removeLoading } from '../../utils';
import PageLoading from '../../components/pageLoading/PageLoading.jsx';
import 'antd/dist/antd.less';
import './main.less';

class App extends React.Component {
    constructor(props) {
        super(props);
        removeLoading();
        this.props.init();
    }

    getChildContext() {
        return {
            location: this.props.location
        }
    }

    render() {
        if (!this.props.app.inited) return <PageLoading />;
        const { pathname } = this.props.location;
        const children = React.cloneElement(this.props.children || <span />, {key: pathname});
        return (
            <div className="main-app">
                <Header/>
                {children}
            </div>
        );
    }
}
App.childContextTypes= {
    location: React.PropTypes.object
}
App.propTypes = {
    user: PropTypes.object,
    children: PropTypes.node.isRequired
};

App.contextTypes = {
    history: PropTypes.object.isRequired,
    store: PropTypes.object.isRequired
};

export default connect(
    state=> {
        const app = state.app;
        const common = state.app;
        return {
            app,
            common
        }
    },
    dispatch => {
        return {
            init: ()=>dispatch(init())
        }
    }
)(App);
